.traffic-control-steps {
  .q-form {
    max-width: 30rem;
  }

  .traffic-ctr__interaction {
    .carry-img {
      width: 100%;
      aspect-ratio: 4/1;

      img {
        position: absolute;
        top: 0;
        width: 100%;
      }
    }

    .carry-slot {
      min-height: 5rem;
    }

    .q-field {
      width: 12.5rem;
    }

    .q-badge {
      top: -.5rem;
      right: -1rem;
    }
  }
}

.task-operation-guide-cls {
  .q-stepper__tab {
    padding: $space-base 0 $space-base * .5;

    .q-stepper__label {
      margin-top: .25rem;
    }
  }

  .q-splitter {
    margin-bottom: -$space-base;

    .q-splitter__before, .q-splitter__separator {
      height: calc(100% - $space-base);
    }
  }

  .q-splitter--vertical > .q-splitter__separator {
    opacity: .5;
    width: .125rem;
    left: -.0625rem;
    cursor: col-resize;

    .q-btn {
      cursor: col-resize;
    }
  }

  .q-splitter__after {
    max-height: 100%;
  }
}